<template>
	<view class="constant">
		<view class="top">
			<view class="top1">
				<view class="iconfont icon-dianhua up"></view>  
				<view class="down">服务热线</view>
			</view>
			<view class="top2">
				<view >电话：</view>  
				<view >邮箱：</view>
				<view >微信：</view>
			</view>
			<view class="top3">
				<view >0791－86762288</view>  
				<view >3207399445@qq.com</view>
				<view >18170022609</view>
			</view>
		</view>
		
		<view class="mid">问题分类</view>
		<view class="buttom">
			<view class="demo" @click="navTo('/pagesun/service/commonProblem/commonProblem')">
				<view class="iconfont icon-wenti  buttom-left"></view>  
				<view class="buttom-mid">常见问题</view>
				<view class="iconfont icon-youjiantou  buttom-right"></view>  
			</view>
			<view class="demo" @click="navTo('/pagesun/service/commonProblem/commonProblem')">
				<view class="iconfont icon-navicon-chps  buttom-left"></view>  
				<view class="buttom-mid">配送问题</view>
				<view class="iconfont icon-youjiantou  buttom-right"></view>  
			</view>
			<view class="demo" @click="navTo('/pagesun/service/commonProblem/commonProblem')">
				<view class="iconfont icon-tuihuo  buttom-left"></view>  
				<view class="buttom-mid">售后问题</view>
				<view class="iconfont icon-youjiantou  buttom-right"></view>  
			</view>
			<view class="demo" @click="navTo('/pagesun/service/commonProblem/commonProblem')">
				<view class="iconfont icon-youhui  buttom-left"></view>     
				<view class="buttom-mid">优惠问题</view>
				<view class="iconfont icon-youjiantou  buttom-right"></view>  
			</view>
			<view class="demo" @click="navTo('/pagesun/service/commonProblem/commonProblem')">
				<view class="iconfont icon-miaosha  buttom-left"></view>     
				<view class="buttom-mid">秒杀问题</view>
				<view class="iconfont icon-youjiantou  buttom-right"></view>  
			</view>
			<view class="demo" @click="navTo('/pagesun/service/commonProblem/commonProblem')">
				<view class="iconfont icon-zhifufangshi  buttom-left"></view>     
				<view class="buttom-mid">支付问题</view>
				<view class="iconfont icon-youjiantou  buttom-right"></view>  
			</view>
			<view class="demo" @click="navTo('/pagesun/service/commonProblem/commonProblem')">
				<view class="iconfont icon-jifen  buttom-left"></view>     
				<view class="buttom-mid">积分问题</view>
				<view class="iconfont icon-youjiantou  buttom-right"></view>  
			</view>
			<view class="demo" @click="navTo('/pagesun/service/commonProblem/commonProblem')">
				<view class="iconfont icon-huiyuan  buttom-left"></view>     
				<view class="buttom-mid">会员问题</view>
				<view class="iconfont icon-youjiantou  buttom-right"></view>  
			</view>
			<view class="demo" @click="navTo('/pagesun/service/commonProblem/commonProblem')">
				<view class="iconfont icon-huodong  buttom-left"></view>     
				<view class="buttom-mid">活动问题</view>
				<view class="iconfont icon-youjiantou  buttom-right"></view>  
			</view>
			<view class="demo" @click="navTo('/pagesun/service/commonProblem/commonProblem')">
				<view class="iconfont icon-qita  buttom-left"></view>     
				<view class="buttom-mid">其他问题</view>
				<view class="iconfont icon-youjiantou  buttom-right"></view>  
			</view>
			
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		onLoad() {
			
		},
		onPullDownRefresh() {
			console.log('refresh');
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		methods: {
			navTo(url){
				uni.navigateTo({  
					url
				})  
			}, 
		}
	}
</script>

<style lang="scss">
	.constant{
		background-color: #f5f5f5;
		
		.top{
			display: flex;
			background-color: #fff;
			margin-bottom: 80upx;
			border: 1upx solid #f5f5f5;
			.top1{
				width: 250upx;
				padding-top: 30upx;
				text-align: center;
				.up{
					font-size: 70upx;
					padding: 25upx 0upx;
					color: #9d9d9d;
				}
				.down{
					font-size: 30upx;
					color: dimgrey;
					text-align: center;
					padding-bottom: 30upx;
				}
			}
			.top2{
				width: 100upx;
				padding: 50upx 10upx;
				line-height: 50upx;
				text-align: right;
				font-size: 25upx;
				color: dimgrey;
			}
			.top3{
				padding: 50upx 10upx;
				line-height: 50upx;
				font-size: 25upx;
			}
		}
		.mid{
			padding-bottom: 20upx;
			font-size: 30upx;
			color: #9d9d9d;
			padding-left: 30upx;
		}
		.buttom{
			border-top: 1upx solid #f5f5f5;
			background-color: #fff;
			.demo{
				padding: 20upx;
				border-bottom: 4upx solid #f5f5f5;
				display: flex;
				.buttom-left{
					font-size: 40upx;
					padding-left: 20upx;
					padding-top: 10upx;
					color: #9d9d9d;
				}
				.buttom-mid{
					font-size: 30upx;
					color: #9d9d9d;
					padding-left: 20upx;
					padding-top: 10upx;
				}
				.buttom-right{
					position: absolute;
					right: 40upx;
					color: #9d9d9d;
				}
			}
		}
	}
</style>
